<%@page import="util.JsonUtil"%>
<%@page import="controller.TimetableCtrl"%>
<%@ page language="java" contentType="text/html; charset=US-ASCII"
	pageEncoding="US-ASCII"%>

<%@ taglib prefix="stripes"
	uri="http://stripes.sourceforge.net/stripes-dynattr.tld"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>


<stripes:layout-render name="/student/master-page.jsp">

	<stripes:layout-component name="head">
		<link
			href='${pageContext.request.contextPath}/assets/css/timetable.css'
			rel='stylesheet' />
		<style>
.table thead>tr>td,.table tbody>tr>td {
	vertical-align: middle;
}

.table .label {
	width: 100%;
	display: block;
}
</style>
	</stripes:layout-component>
	<stripes:layout-component name="content">

		<center>
			<stripes:messages />
		</center>

		<div class="container legend">
			<div class="row">
				<div class="col-md-12">
					<span class="label label-default">Legend:</span> <span
						class="label label-success">Successful</span> <span
						class="label label-primary">Pending</span> 
						<!-- <span
						class="label label-warning">Bookmarked</span> -->
				</div>
			</div>
		</div>


		<ul class="nav nav-tabs">
			<li class="passive"><a
				href="${pageContext.request.contextPath}/timetable/view">Timetable</a></li>
			<li class="active"><a
				href="${pageContext.request.contextPath}/timetable/exam">Exams</a></li>
		</ul>


		<div class="panel panel-info">
			<div class="panel-heading">
				<h3 class="panel-title">Exam Timetable</h3>
			</div>

			<table class="table table-striped">
				<thead>
					<tr>
						<th>Course</th>
						<th>Title</th>
						<th>Exam Date</th>
						<th>Exam Time</th>
						<th class="text-center">Status</th>
					</tr>
				</thead>

				<tbody>

					<c:set var="courses"
						value="${actionBean.retrieveSuccessfulCourses()}" />
					<c:forEach items="${courses}" var="eachCourse">
						<tr>
							<td>${eachCourse.courseCode}</td>
							<td>${eachCourse.title}</td>
							<td>${eachCourse.getExamDate("EEE, dd MMM yyyy") }</td>
							<td>${eachCourse.getExamStartTime("HH:mm") } -
								${eachCourse.getExamEndTime("HH:mm") }</td>
							<td><span class="label label-success">Successful</span></td>
						</tr>
					</c:forEach>

					<c:set var="courses" value="${actionBean.retrievePendingCourses()}" />

					<c:forEach items="${courses}" var="eachCourse">

						<tr>
							<td>${eachCourse.courseCode}</td>
							<td>${eachCourse.title}</td>
							<td>${eachCourse.getExamDate("EEE, dd MMM yyyy") }</td>
							<td>${eachCourse.getExamStartTime("HH:mm") } -
								${eachCourse.getExamEndTime("HH:mm") }</td>
							<td><span class="label label-primary">Pending</span></td>
						</tr>
					</c:forEach>
 
				</tbody>
			</table>
		</div>

	</stripes:layout-component>

</stripes:layout-render>
